<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
{{>/WEB-INF/pages/common/meta_base.part.html}}
{{>/WEB-INF/pages/common/refs_base.part.html}}
<meta charset="utf-8">
<title>变色龙 移动平台</title>
<style type="text/css">
    span.error{
    	background-position: 0px 5px;
    	float:left;
    	margin-left:3em;
        clear: both;
    }
</style>
</head>
<body>
<div class="row-fluid login_head" >
    <div class="login_logo text-left mar-st-l10"></div>
</div>

<!--Top//End--> 
<!--Con//Start-->
<div class="hr-5"></div>
<div class="bg_c" >
  <div class="login_con1">
  </div>
   <form id="loginForm" action="" method="post">
    <div class="col-sm-4 login col-sm-offset-7">
       <ul >
       		<li><p>租户名：</p>
			<input id="accUsername" name="accUsername" type="text" class="form-control" /></li>
			<li><p>用户名：</p>
			<input id="username" name="username" type="text" class="form-control" /></li>
			<li><p>密　码：</p>
			<input id="password" name="password" type="password" class="form-control" onpaste="return false;" /></li>
			<!-- <li><p>校验码：</p><input name="" class="form-control" type="password" /></li> -->
			<li class="pad-st-l60">
				<button id="btn_login" class="btn btn-info btn-large but2" type="submit">登录</button>
				&nbsp;&nbsp;&nbsp;<a href="{{ctx}}/system/account/register-view" target="_blank">注册</a>
			</li>
			<div id="info" class="alert fade in" style="text-align: center;">
	            <strong></strong>
          	</div>
		</ul>	
    </div>
    </form>
</div>
<!--Con//End--> 
<!--Foot//Start-->
<div class="container">
  <p class="text-center pad-st-b10 muted">Forever Opensource Software Inc. All rights reserved.</p>
</div>
<!--Foot//End-->
</body>
</html>
<script type="text/javascript">
	$(document).ready(function() {
		//聚焦第一个输入框
		$("#accUsername").focus();
		//为loginForm注册validate函数
		$("#loginForm").validate({
			event: "keyup" ,
			rules:{
				username:{
					required:true,
					minlength:3
				},
				password:{
					required:true,
					minlength:3
				},
			},
			messages:{
				username:{
					required:"请输入帐号",
					minlength: "用户名长度至少为 3字符"
				},
				password:{
					required:"请输入密码",
					minlength: "密码至少输入 3字符"
				}
			},
			success: function(label) {
				//label指向上面那个错误提示信息标签em
				label.text("")				//清空错误提示消息
					.addClass("success");	//加上自定义的success类
			}
		});
		
		$("#info").hide();
		$("#loginForm").submit(function(evt){
			var form = $(this);
			if(form.valid()==false){
				evt.preventDefault();
				return false;
			}

			$("#info").hide();
			var data=$("#loginForm").serialize();
			$('#btn_login').prop('disabled', true);
			$.ajax({ 
				type: "POST", 
				url: "{{ctx}}/system/account/login", 
				data: data, 
				headers: {
					Accept: "application/json; charset=utf-8"
				},
				contentType: "application/x-www-form-urlencoded; charset=utf-8", 
				dataType: "text", 
				success: function(text) {
					var ret=$.parseJSON(text);
					if(ret.result){
						window.location.href = "{{ctx}}/mam/appMain/list-view";
					}
					else{
						$('#btn_login').prop('disabled', false);
						$("#info strong").html(ret.message);
						$("#info").show();
					}
				}, 
				error: function(xhr) { 
					$('#btn_login').prop('disabled', false);
					$("#info strong").html(xhr.responseText);
					$("#info").show();
				}
			});
			evt.preventDefault();
			return false;
		});
	});
</script>